<!-- 行政班级-班级管理-添加学生 -->
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
		<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
		<link rel="stylesheet" href="/css/font.css">
		<link rel="stylesheet" href="/css/xadmin.css">
		<link rel="stylesheet" href="/css/myCustom.css">
	</head>

	<body>
		<div class="x-body" id="app">
			<xblock class="layui-form">
				<button class="layui-btn layui-btn-normal" onclick="addBatchCourseToTeacher()"><i class="layui-icon"></i>批量添加</button>
				<a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);"
				 title="刷新"><i class="layui-icon" style="line-height:30px">ဂ</i></a>
				 <div class="layui-input-inline">
                    <select lay-filter="selectMajorNo">
                        <option value="all">选择专业</option>
                        <option v-for="major in majors" :value="major.majorNo">{{ major.majorName }}</option>
                    </select>
                </div>
				 <input type="hidden" name="teacherNo" th:attr="value=${teacherNo}"/>
				 <input type="hidden" name="orgId" th:attr="value=${orgId}"/>
				<span class="x-right" style="line-height:40px">共有数据：{{ pageInfo.total }} 条，当前{{ pageInfo.pageNum }} / {{ pageInfo.pages }}页</span>
			</xblock>
			<table class="layui-table">
				<thead>
					<tr>
						<th width="20">
							<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
						</th>
						<th>课程代码</th>
						<th>课程名称</th>
						<th width="80">课程性质</th>
						<th>学分</th>
						<th>上课周期</th>
						<th width="100">所属专业</th>
						<th width="100">操作</th>
				</thead>
				<tbody>
					<tr v-for="course in courses">
						<td>
							<div class="layui-unselect layui-form-checkbox" lay-skin="primary" :data-id='course.courseNo' :data-courseName="course.courseName"><i class="layui-icon">&#xe605;</i></div>
						</td>
						<td>{{ course.courseNo }}</td>
						<td>{{ course.courseName }}</td>
						<td v-if="course.type == 1">必修</td>
						<td v-else-if="course.type == 2">专业选修</td>
						<td>{{ course.credit }}</td>
						<td>{{ course.time }}</td>
						<template v-if="course.majorNo == 0">
						  <td></td>
						</template>
						<template v-else>
						   <template v-for="major in majors">
	                           <td v-if="course.majorNo == major.majorNo">{{ major.majorName }}</td>
						   </template>
                        </template>
						<td class="td-manage">
							<button class="layui-btn-normal layui-btn layui-btn-sm" onclick="addCourseToTeacher(this)" href="javascript:;"><i
								 class="layui-icon">&#xe640;</i>添加</button>
						</td>
					</tr>
				</tbody>
			</table>
			<div class="page" style="margin-top: 10px !important;">
                 <div>
                   <a class="prev pageTxt" href="javascript:void(0)">上一页</a>
                   <a class="first pageTxt" href="javascript:void(0)">首页</a>
                   <template v-for="pageNum in pageInfo.navigatepageNums">
                       <a class="num" href="javascript:void(0)" v-if="pageInfo.pageNum != pageNum" :data="pageNum">{{ pageNum }}</a>
                       <span class="current" v-else :data="pageNum">{{ pageNum }}</span>
                   </template>
                   <a class="last pageTxt" href="javascript:void(0)">尾页</a>
                   <a class="next pageTxt" href="javascript:void(0)">下一页</a>
                 </div>
           </div>
		</div>
		<script type="text/javascript" src="/js/jquery.min.js"></script>
        <script type="text/javascript" src="/js/xadmin.js"></script>
        <script type="text/javascript" src="/lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="/js/vue.min.js"></script>
        <script type="text/javascript" src="/js/jquery.form.js"></script>
		<script>
			var vm = new Vue({
	            el : '#app',
	            data : {
	                // 课程列表
	                courses : "",
	                pageInfo: "",
	                // 专业列表
	                majors: "",
	                // 专业代码('all'代表所有：公选课+该院系下所有专业的课程)
	                majorNo: "all",
	                // 当前院系id
	                orgId : "",
	                // 当前教师编号
	                teacherNo: ""
	            },
	            created : function() {
	                this.teacherNo = $("input[name='teacherNo']").val();
	                this.orgId = $("input[name='orgId']").val();
	                // 获取该院系下所有专业列表
	                this.listMajorByOrgId(this.orgId);
	                // 根据院系id获取课程列表
	                this.listCourseByMajorNo(this.orgId, this.majorNo, 1);
	            },
	            methods : {
	            	listMajorByOrgId : function(orgId) {
                        var vm = this;
                        $.ajax({
                            url : "/sys/teacher/course/listMajorByOrgId",
                            data: {
                            	orgId: orgId
                            },
                            type : "get",
                            success : function(result) {
                                if (result.state) {
                                    vm.majors = result.data;
                                } else {
                                    layui.use(['layer'], function(){
                                        var layer = layui.layer
                                        layer.msg(""+result.msg, {icon: 5});
                                    });
                                }
                            }
                        });
                    },
                    listCourseByMajorNo : function(orgId, majorNo, pageNum) {
	                    var vm = this;
	                    $.ajax({
	                        url : "/sys/teacher/course/listCourseByMajorNo",
	                        data: {
	                        	orgId: orgId,
	                        	majorNo: majorNo,
	                        	pageNum: pageNum
	                        },
	                        type : "get",
	                        success : function(result) {
	                            if (result.state) {
	                                vm.pageInfo = result.data;
	                                vm.courses = result.data.list;
	                            } else {
	                                layui.use(['layer'], function(){
	                                    var layer = layui.layer
	                                    layer.msg(""+result.msg, {icon: 5});
	                                });
	                            }
	                        }
	                    });
	                }
	            }
	        });
		
			// select监听
            layui.use('form', function(){
               var form = layui.form;//高版本建议把括号去掉，有的低版本，需要加()
               form.on('select(selectMajorNo)', function(data){
                    vm.listCourseByMajorNo(vm.orgId, data.value, 1);
                    vm.majorNo = data.value;
               });
           });
			
			// 批量添加课程给教师
			function addBatchCourseToTeacher() {
				var courseNo = tableCheck.getData();
                if (courseNo.length <= 0) {
                    return;
                }
                // 获取选中的课程名称
                var obj = $(".layui-form-checked").not('.header');
                var courseName=[];
                obj.each(function(index, el) {
                	courseName.push(obj.eq(index).attr('data-courseName'));
                });
                layer.confirm('确认要添加【'+courseName+'】吗？', function(index) {
                    $.ajax({
                        url : "/sys/teacher/course/addCourseToTeacher",
                        type : "post",
                        data : {
                        	courseNo: courseNo,
                        	teacherNo: vm.teacherNo
                        },
                        success : function(result) {
                            if (result.state) {
                                layer.msg('添加成功', {icon: 1});
                                // 移除所有checkbox的勾选状态
                                $(".layui-form-checkbox").removeClass('layui-form-checked');
                            } else {
                                layer.msg(""+result.msg, {icon: 5});
                            }
                        }
                    });
                });
			}
			
			// 单个添加课程到教师
            function addCourseToTeacher(obj) {
                var courseName = $(obj).parents("tr").find("div:first").attr("data-courseName");
                var id = $(obj).parents("tr").find("div:first").attr("data-id");
                var courseNo = [];
                courseNo.push(id);
                layer.confirm('确认要添加【'+courseName+'】吗？', function(index) {
                     $.ajax({
                          url : "/sys/teacher/course/addCourseToTeacher",
                          type : "post",
                          data : {
                        	  courseNo: courseNo,
                        	  teacherNo: vm.teacherNo
                          },
                          success : function(result) {
                              if (result.state) {
                                  layer.msg('添加成功!',{icon:1,time:1000});
                              } else {
                                  layer.msg(""+result.msg, {icon: 5});
                              }
                          }
                      });
                });
            }
			
            // 点击页码数，进行跳转
            $(".page").delegate(".num", "click", function() {
                var pageNum = $(this).attr("data");
                vm.listCourseByMajorNo(vm.orgId, vm.majorNo, pageNum);
            });
            // 上一页
            $(".page").delegate(".prev", "click", function() {
                if (vm.pageInfo.hasPreviousPage) {
                    vm.listCourseByMajorNo(vm.orgId, vm.majorNo, vm.pageInfo.pageNum - 1);
                }
            });
            // 下一页
            $(".page").delegate(".next", "click", function() {
                if (vm.pageInfo.hasNextPage) {
                    vm.listCourseByMajorNo(vm.orgId, vm.majorNo, vm.pageInfo.pageNum + 1);
                }
            });
            // 首页
            $(".page").delegate(".first", "click", function() {
                if (!vm.pageInfo.isFirstPage) {
                    vm.listCourseByMajorNo(vm.orgId, vm.majorNo, 1);
                }
            });
            // 尾页
            $(".page").delegate(".last", "click", function() {
                if (!vm.pageInfo.isLastPage) {
                    vm.listCourseByMajorNo(vm.orgId, vm.majorNo, vm.pageInfo.pages);
                }
            });
			
			
		</script>
	</body>

</html>
